<template>
  <div style>
    <div
        v-if="loading"
        style="position: fixed;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;"
    >
      <Loading size="24px" vertical>数据整理中...</Loading>
    </div>
    <div style="background: rgba(69,69,146,0.06);position: relative;" v-else>
      <div
          style="z-index:2;background-color: #fff;height: 58px;display: flex;align-items: center;position:fixed;width:100%;top:0;">
        <div @click="handleCalendarShow" style="display:flex;font-family: PingFangSC-Medium;font-size: 20px;
                     color: #454592;letter-spacing: 0.38px;text-align: justify;line-height: 30px;margin:12px 0 12px 28px;
                     width: 149px;height: 34px;background: rgba(69,69,146,0.06);border-radius: 17.5px;margin-left: 12px;">
          <div style="width: 78%;display: flex;justify-content: center;align-items: center">{{ cal_label }}</div>
          <div style="width: 20%;display: flex;justify-content: center;align-items: center;">
            <img :src="down_cc" style="width: 24px;height: 24px;"/>
          </div>
        </div>
        <div
            style="position: absolute;right: 20px;font-family: PingFangSC-Regular;font-size: 12px;color: #999999;letter-spacing: 0.22px;line-height: 16px;">
          <img :src="Combined" style="width: 11.2px;height: 12px;"/>
          {{ buName }}
        </div>
      </div>
      <Overlay :show="fullCalendarShow" :z-index="2" @click.stop="ListhandleDayClick(day)">
        <Calendar v-model="day" style="position: fixed;"/>
      </Overlay>
      <div style="width: 100%;display: flex;background: #fff;border-radius: 0 0 20px 20px;margin-top:58px;">
        <div style="width: 80%;">
          <div style="padding:0px 10px 20px 28px;display: flex;flex-wrap: wrap;">
            <div
                style="margin-right:5px;width: 29px;height: 29px;display: flex;justify-content: center;align-items: center;font-family: PingFangSC-Regular;font-size: 14px;color: #666666;letter-spacing: 0.26px;text-align: justify;border-radius: 50%;"
                v-for="(item,index) in dayList"
                :key="index"
                :style="{background:day==item.day?'#31317E':'',color:day==item.day?'#fff':''}"
                @click="handleDayClick(item.day)"
            >{{ item.idx }}
            </div>
          </div>
        </div>
        <div style="display: flex;flex-direction: row;width: 19%;padding-top:4px;">
          <div style="margin-right:20px;">
            <img :src="left_icon" style="width: 16px;height: 16px;" @click="changeWeek('preWeek')"/>
          </div>
          <div>
            <img
                :src="right_icon"
                style="width: 16px;height: 16px;"
                @click="changeWeek('nextWeek')"
            />
          </div>
        </div>
        <br/>
      </div>
      <div
          style="position: relative;margin: 0 12px 0 12px;display: flex;flex-direction: row;justify-content: space-between;height: 45px;border-bottom: 1px solid #dddddd;">
        <div class="search">
          <img :src="Seched" @click="clickSearch"/>
          <form action="javasearchTextscript:void 0" style="display: flex;">
            <input class="input" @input="inputSearch($event)" :value="searchText" type="search"
                   @keyup.13="clickSearch"
                   placeholder="搜索医生"/>
            <img :src="close_icon" style="width: 20px;height:20px;" v-if="searchText" @click="searchText=''"/>
          </form>
        </div>
        <div v-if="!AllExpandIcon" style="display: flex;flex-direction: column;justify-content: center">
          <img :src="ExpandAll" style="transform: rotate(180deg)" @click="showAll()">
        </div>
        <div v-else style="display: flex;flex-direction: column;justify-content: center">
          <img :src="ExpandAll" @click="showAll()">
        </div>
        <img v-if="selectScreenNum === 0 && !showScreen" :src="update" @click="clickScreen"
             style="margin-right: 25px;"/>
        <img v-if="selectScreenNum > 0 || showScreen" :src="update2" @click="clickScreen"
             style="margin-right: 25px;"/>
        <div v-if="selectScreenNum > 0 && !showScreen" style="position: absolute;top: 9px;right: 10px;">
          <div class="standardNum"
               style="font-size: 8px;width: 12px;height: 12px;border: 1px solid #454592;border-radius: 10px;">
            {{ selectScreenNum }}
          </div>
        </div>
      </div>
      <!--      ///-->
      <div v-if="showScreen" style="padding: 8px 20px 330px;">
        <!--        线上线下-->
        <div class="title_top">
          <div class="titleicon"></div>
          <div class="title_right" style="display: flex">线上线下</div>
        </div>
        <div class="screenList">
          <div v-for="(item, index) in callTypeList" v-bind:key="index" @click="handleCallTypeSelected(index)"
               :style="item.selected?'color:#454592;border-color:#454592;background: rgba(69, 69, 146, 0.1);':''"
               class="screen_item">
            {{ item.descr }}
          </div>
        </div>
        <!--        日程类型-->
        <div class="title_top">
          <div class="titleicon"></div>
          <div class="title_right">日程类型</div>
        </div>
        <div style="display: flex;flex-direction: row;justify-content: space-between;">
          <div class="screenList" style="width: 90%">
            <div v-for="(item, index) in callTypeSubList" v-bind:key="index"
                 @click="handleCallTypeSubSelected(index)"
                 :style="item.selected?'color:#454592;border-color:#454592;background: rgba(69, 69, 146, 0.1);':''"
                 class="screen_item">
              {{ item.descr }}
            </div>
          </div>
        </div>
        <!--        状态-->
        <div class="title_top">
          <div class="titleicon"></div>
          <div class="title_right">状态</div>
        </div>
        <div style="display: flex;flex-direction: row;justify-content: space-between;">
          <div class="screenList">
            <div v-for="(item, index) in statusList" v-bind:key="index"
                 @click="handleStatusSelected(index)"
                 :style="item.selected?'color:#454592;border-color:#454592;background: rgba(69, 69, 146, 0.1);':''"
                 class="screen_item">
              {{ item.descr }}
            </div>
          </div>
        </div>
      </div>
      <div v-if="showScreen" style="position: fixed;z-index: 9999;bottom: 0;width: 100%;">
        <div style="display: flex;flex-direction: row;justify-content: space-between;padding: 20px;">
          <div class="button" @click="resetScreen"
               :style="'width:' + (clientWidth - 60) / 2 + 'px;background: #ACB318;'">重置
          </div>
          <div class="button" @click="screenResult"
               :style="'width:' + (clientWidth - 60) / 2 + 'px;background: #454592;'">查看
          </div>
        </div>
      </div>
      <div class="add_fix" v-if="!showScreen" @click="nav2add">
        <img :src="add_icon"/>
      </div>
      <!--      //-->
      <div v-if="!showScreen" style="display: flex;flex-direction: column;padding: 0;">
        <div id="flag">
          <div class="task_wrapper" v-for="(item,index) in flagList"
               :id="'el'+item.callPlanId">
            <div class="task_block" @click="nav2detail(item.callPlanId)">
              <div class="tack_Icon">
                <!--                  显示收缩-->
                <div class="More" v-if="item.isMore==true">
                  <div v-if="item.tableShow==true">
                    <img :src="SeeMore" @click.stop="showTable(index,2)"/>
                  </div>
                  <div v-else>
                    <img :src="SeeMoreDown" style="transform:rotate(0deg);" @click.stop="CloseshowTable(index,2)"/>
                  </div>
                </div>
                <div class="More" v-else>
                  <img :src="SeeMore" @click.stop=""/>
                </div>
              </div>
              <div class="task">
                <div class="task_title_icon">
                  <div class="task_icon_Y">
                    <div class="task_icon"
                         :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                  </div>
                  <div class="task_title">
                    {{ item.callType }}:{{ item.title }}
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_date" v-if="item.callType=='线上拜访'">
                    {{ item.time.replace('T', ' ') }} | 线上文章推荐
                  </div>
                  <div class="task_date" v-else>
                    {{ item.time.replace('T', ' ') }} | 线下文章推荐
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_contact">
                    {{ item.hospital }}
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                    推荐文章:{{ item.callMaterialName }}
                  </div>
                </div>
                <!--                  置顶-->
                <div class="task_Topping" v-if="item.callType=='线上拜访'">
                  <img :src="OnlineTopping" @click.stop="flag2common(index)">
                </div>
                <div class="task_Topping" v-else>
                  <img :src="UnderLinetop" @click.stop="flag2common(index)">
                </div>
              </div>
            </div>
            <div v-if="item.tableShow==false">
              <div class="task_wrapper1" v-for="(item,index) in item.MoreList"
                   @click="nav2detail(item.callPlanId)" :id="'el'+item.callPlanId">
                <div class="task_block">
                  <div class="task">
                    <div class="task_title_icon">
                      <div class="task_icon_Y">
                        <div class="task_icon"
                             :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                      </div>
                      <div class="task_title">
                        {{ item.callType }}:{{ item.title }}
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_date" v-if="item.callType=='线上拜访'">
                        {{ item.time.replace('T', ' ') }} | 线上文章推荐
                      </div>
                      <div class="task_date" v-else>
                        {{ item.time.replace('T', ' ') }} | 线下文章推荐
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_contact">
                        {{ item.hospital }}
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                        推荐文章:{{ item.callMaterialName }}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div id="common">
          <draggable :list="commonList" handle=".drag">
            <div class="task_wrapper" v-for="(item,index) in commonList"
                 :id="'el'+item.callPlanId">
              <div class="task_block" @click="nav2detail(item.callPlanId)">
                <div class="tack_Icon">
                  <!--                  显示收缩-->
                  <div class="More" v-if="item.isMore==true">
                    <div v-if="item.tableShow==true">
                      <img :src="SeeMore" @click.stop="showTable(index,3)"/>
                    </div>
                    <div v-else>
                      <img :src="SeeMoreDown" style="transform:rotate(0deg);" @click.stop="CloseshowTable(index,3)"/>
                    </div>
                  </div>
                  <div class="More" v-else>
                    <img :src="SeeMore" @click.stop=""/>
                  </div>
                  <div class="drag">
                    <img :src="drag_icon"/>
                  </div>
                </div>
                <div class="task">
                  <div class="task_title_icon">
                    <div class="task_icon_Y">
                      <div class="task_icon"
                           :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                    </div>
                    <div class="task_title">
                      {{ item.callType }}:{{ item.title }}
                    </div>
                  </div>
                  <div class="task_title_icon">
                    <div class="task_icon_K">
                    </div>
                    <div class="task_date" v-if="item.callType=='线上拜访'">
                      {{ item.time.replace('T', ' ') }} | 线上文章推荐
                    </div>
                    <div class="task_date" v-else>
                      {{ item.time.replace('T', ' ') }} | 线下文章推荐
                    </div>
                  </div>
                  <div class="task_title_icon">
                    <div class="task_icon_K">
                    </div>
                    <div class="task_contact">
                      {{ item.hospital }}
                    </div>
                  </div>
                  <div class="task_title_icon">
                    <div class="task_icon_K">
                    </div>
                    <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                      推荐文章:{{ item.callMaterialName }}
                    </div>
                  </div>
                  <!--                  置顶-->
                  <div class="task_Topping" v-if="item.callType=='线上拜访'">
                    <img :src="onlineicon" @click.stop="common2flag(index)">
                  </div>
                  <div class="task_Topping" v-else>
                    <img :src="offlineicon" @click.stop="common2flag(index)">
                  </div>
                </div>
              </div>
              <div v-if="item.tableShow==false">
                <div class="task_wrapper1" v-for="(item,index) in item.MoreList"
                     @click="nav2detail(item.callPlanId)" :id="'el'+item.callPlanId">
                  <div class="task_block">
                    <div class="task">
                      <div class="task_title_icon">
                        <div class="task_icon_Y">
                          <div class="task_icon"
                               :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                        </div>
                        <div class="task_title">
                          {{ item.callType }}:{{ item.title }}
                        </div>
                      </div>
                      <div class="task_title_icon">
                        <div class="task_icon_K">
                        </div>
                        <div class="task_date" v-if="item.callType=='线上拜访'">
                          {{ item.time.replace('T', ' ') }} | 线上文章推荐
                        </div>
                        <div class="task_date" v-else>
                          {{ item.time.replace('T', ' ') }} | 线下文章推荐
                        </div>
                      </div>
                      <div class="task_title_icon">
                        <div class="task_icon_K">
                        </div>
                        <div class="task_contact">
                          {{ item.hospital }}
                        </div>
                      </div>
                      <div class="task_title_icon">
                        <div class="task_icon_K">
                        </div>
                        <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                          推荐文章:{{ item.callMaterialName }}
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </draggable>
        </div>
        <div id="finish">
          <div class="task_wrapper" v-for="(item,index) in finishList"
               :id="'el'+item.callPlanId">
            <div class="task_block" @click="nav2detail(item.callPlanId)">
              <div class="tack_Icon">
                <!--                  显示收缩-->
                <div class="More" v-if="item.isMore==true">
                  <div v-if="item.tableShow==true">
                    <img :src="SeeMore" @click.stop="showTable(index,1)"/>
                  </div>
                  <div v-else>
                    <img :src="SeeMoreDown" style="transform:rotate(0deg);" @click.stop="CloseshowTable(index,1)"/>
                  </div>
                </div>
                <div class="More" v-else>
                  <img :src="SeeMore" @click.stop=""/>
                </div>
              </div>
              <div class="task">
                <div class="task_title_icon">
                  <div class="task_icon_Y">
                    <div class="task_icon"
                         :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                  </div>
                  <div class="task_title">
                    {{ item.callType }}:{{ item.title }}
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_date" v-if="item.callType=='线上拜访'">
                    {{ item.time.replace('T', ' ') }} | 线上文章推荐
                  </div>
                  <div class="task_date" v-else>
                    {{ item.time.replace('T', ' ') }} | 线下文章推荐
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_contact">
                    {{ item.hospital }}
                  </div>
                </div>
                <div class="task_title_icon">
                  <div class="task_icon_K">
                  </div>
                  <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                    推荐文章:{{ item.callMaterialName }}
                  </div>
                  <div class="task_Completion" v-if="item.callType=='线上拜访'">
                    <img :src="OnlineCompletion">
                  </div>
                  <div v-else>
                    <img :src="OfflineCompletion">
                  </div>
                </div>
              </div>
            </div>
            <div v-if="item.tableShow==false">
              <div class="task_wrapper1" v-for="(item,index) in item.MoreList"
                   @click="nav2detail(item.callPlanId)" :id="'el'+item.callPlanId">
                <div class="task_block">
                  <div class="task">
                    <div class="task_title_icon">
                      <div class="task_icon_Y">
                        <div class="task_icon"
                             :style="item.callType=='线上拜访'?'background:#ACB318':'background:#FACC14'"></div>
                      </div>
                      <div class="task_title">
                        {{ item.callType }}:{{ item.title }}
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_date" v-if="item.callType=='线上拜访'">
                        {{ item.time.replace('T', ' ') }} | 线上文章推荐
                      </div>
                      <div class="task_date" v-else>
                        {{ item.time.replace('T', ' ') }} | 线下文章推荐
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_contact">
                        {{ item.hospital }}
                      </div>
                    </div>
                    <div class="task_title_icon">
                      <div class="task_icon_K">
                      </div>
                      <div class="task_article" :style="item.callType=='线上拜访'?'color:#ACB318':'color:#FACC14'">
                        推荐文章:{{ item.callMaterialName }}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

      </div>
      <div v-if="showScreen==false">
        <infinite-loading @infinite="getPageData" ref="infiniteLoading" :identifier="cal_label">
                        <span slot="no-more">
                          <span
                              style="margin-top: 10px;font-family: PingFangSC-Regular;font-size: 12px;color: #999999;letter-spacing: 0.22px;text-align: justify;line-height: 16px;height: 30px;display: flex;justify-content: center;">
                            没有更多记录</span>
                        </span>
          <span slot="no-results"
                style="margin-top: 10px;font-family: PingFangSC-Regular;font-size: 12px;color: #999999;letter-spacing: 0.22px;text-align: justify;line-height: 16px;height: 30px;display: flex;justify-content: center;">
          没有更多记录
        </span>
        </infinite-loading>
      </div>
    </div>
  </div>

</template>

<script>
import Vue from "vue";
import {Loading} from "vant";
import left_icon from "@assets/icon/chevron_left.svg";
import right_icon from "@assets/icon/chevron_right.svg";
import Seched from '@assets/icon/20.svg';
import close_icon from '@assets/icon/close.svg';
import add_icon from '@assets/image/Group 2.svg'
import dayjs from "dayjs";
import down_cc from "@assets/icon/34.svg";
import onlineicon from "@assets/icon/onlineicon.svg";
import offlineicon from "@assets/icon/offlineicon.svg";
import unrelease from "@assets/image/coming_soon.png";
import InfiniteLoading from 'vue-infinite-loading';
import warning from "@assets/icon/warning.svg";
import info from "@assets/icon/16.svg";
import right from "@assets/icon/right.svg";
import down from "@assets/icon/down.svg";
import up from "@assets/icon/up.svg";
import Calendar from "@components/snfDashboardCalendar";
import Combined from "@assets/icon/Combined Shape.svg";
import update from "@assets/icon/21.svg";
import update2 from "@assets/icon/22.svg";
import SeeMore from '@assets/image/SeeMore.svg'
import SeeMoreDown from '@assets/image/SeeMoreDown.svg'
import DragndaDrop from '@assets/image/DragndaDrop.svg'
import OnlineTopping from '@assets/icon/OnlineTopping.svg'
import UnderLinetop from '@assets/icon/UnderLinetop.svg'
import OnlineCompletion from '@assets/icon/OnlineCompletion.svg'
import OfflineCompletion from '@assets/icon/OfflineCompletion.svg'
import ExpandAll from '@assets/icon/ExpandAll.svg'
import drag_icon from '@assets/image/drag.png'
import {Tab, Tabs, Circle, Overlay} from "vant";
import draggable from 'vuedraggable'
import {
  scheduleDimensionTypeQuery,
  scheduleDimensionStatusQuery,
  queryScheduleList, scheduleTopUpdate, scheduleMoreQuery,
  schedulefeedback
} from "@api/schedule";

Vue.use(Tab);
Vue.use(Tabs);
Vue.use(Circle);

export default {
  name: "DM",
  components: {
    InfiniteLoading,
    Tab,
    Tabs,
    Calendar,
    Loading,
    Overlay,
    Seched,
    update,
    update2,
    draggable,
  },
  data() {
    return {
      drag_icon: drag_icon,
      AllExpandIcon: false,
      ExpandAll: ExpandAll,
      OnlineCompletion: OnlineCompletion,
      OfflineCompletion: OfflineCompletion,
      clientWidth: document.documentElement.clientWidth, // 页面宽度
      cal_label: "",
      weekday: "",
      buName: sessionStorage.getItem("email"),
      bu: sessionStorage.getItem("bu"),
      Combined: Combined,
      unrelease: unrelease,
      fullCalendarShow: false,
      loading: true,
      left_icon: left_icon,
      right_icon: right_icon,
      dayList: [],
      down_cc: down_cc,
      pageNo: 1,
      pageSize: 10,
      info: info,
      right: right,
      warning: warning,
      down: down,
      up: up,
      day: "",
      callTypeList: [],
      callTypeSubList: [],
      statusList: [],
      commonList: [],
      finishList: [],
      flagList: [],
      Seched: Seched,
      searchText: '',
      close_icon: close_icon,
      selectScreenNum: 0,
      showScreen: false,
      update: update,
      update2: update2,
      add_icon: add_icon,
      SeeMore: SeeMore,
      SeeMoreDown: SeeMoreDown,
      DragndaDrop: DragndaDrop,
      onlineicon: onlineicon,
      offlineicon: offlineicon,
      chooseDay: null,
      OnlineTopping: OnlineTopping,
      UnderLinetop: UnderLinetop
    };
  },
  methods: {
    showAll() {
      this.AllExpandIcon = !this.AllExpandIcon;
      if (this.AllExpandIcon === false) {
        //收起
        this.commonList.forEach((item, idx) => {
          item.tableShow = true;
        })
        this.finishList.forEach((item, idx) => {
          item.tableShow = true;
        })
        this.flagList.forEach((item, idx) => {
          item.tableShow = true;
        })
      } else {
        //展开
        this.commonList.forEach((item, idx) => {
          item.MoreList = [];
          this.getMoreData(item.contactId, item.callPlanId, 3, idx);
          item.tableShow = false;
        })
        this.finishList.forEach((item, idx) => {
          item.MoreList = [];
          this.getMoreData(item.contactId, item.callPlanId, 1, idx);
          item.tableShow = false;
        })
        this.flagList.forEach((item, idx) => {
          item.MoreList = [];
          this.getMoreData(item.contactId, item.callPlanId, 2, idx);
          item.tableShow = false;
        })
      }
    },
    common2flag(index) {
      //获取完成数据
      let obj = this.commonList[index]
      //设置置顶状态
      obj.flag = 1

      //后台更新数据
      scheduleTopUpdate({id: obj.callPlanId, isTop: true}).then(res => {
        if (res.successful) {
          //添加动画
          const element = document.querySelector(`#el${obj.callPlanId}`)
          // element.classList.add('animated', 'slideOutUp', 'faster')
          // element.addEventListener('animationend', () => {
          //交换数据
          this.commonList.splice(index, 1)
          this.flagList.unshift(obj)
          // console.log(this.commonList)
          // })
        } else {
          alert(res.message)
        }

      })


    },
    flag2common(index) {
      //获取完成数据
      let obj = this.flagList[index]
      //设置置顶状态
      obj.flag = 0

      //后台更新数据
      scheduleTopUpdate({id: obj.callPlanId, isTop: false}).then(res => {
        if (res.successful) {
          //交换数据
          this.flagList.splice(index, 1)
          this.commonList.unshift(obj)
        } else {
          alert(res.message)
        }

      })

    },
    getMoreData(contactId, callPlanId, type, index) {
      //组装请求参数
      let param = {
        startDate: this.chooseDay,
        endDate: this.chooseDay,
        online: this.callTypeList.filter(item => item.selected).map(item => item.descr),
        onlineSub: this.callTypeSubList.filter(item => item.selected).map(item => item.descr),
        contactId: contactId,
        callPlanId: callPlanId,
      }
      //请求列表数据
      scheduleMoreQuery(param).then((res) => {
            if (res.statusCode == 200) {
              for (let i = 0; i < res.data.length; i++) {
                let item = res.data[i]
                //处理时间
                item.time = dayjs(item.time).format("HH:mm:ss");
                if (type == 3) {
                  this.commonList[index].MoreList.push(item)
                } else if (type == 2) {
                  this.flagList[index].MoreList.push(item)
                } else {
                  this.finishList[index].MoreList.push(item)
                }
              }
            }
          }
      )
    },
    showTable(index, type) {
      switch (type) {
        case 1:
          this.finishList[index].MoreList = [];
          this.getMoreData(this.finishList[index].contactId, this.finishList[index].callPlanId, 1, index);
          this.finishList[index].tableShow = false;
          break;
        case 2:
          this.flagList[index].MoreList = [];
          this.getMoreData(this.flagList[index].contactId, this.flagList[index].callPlanId, 2, index);
          this.flagList[index].tableShow = false;
          break;
        case 3:
          this.commonList[index].MoreList = [];
          this.getMoreData(this.commonList[index].contactId, this.commonList[index].callPlanId, 3, index);
          this.commonList[index].tableShow = false;
          break;
        default:
          break;
      }
    },
    CloseshowTable(index, type) {
      switch (type) {
        case 1:
          this.finishList[index].tableShow = true;
          break;
        case 2:
          this.flagList[index].tableShow = true;
          break;
        case 3:
          this.commonList[index].tableShow = true;
          break;
        default:
          break;
      }
    },
    changeWeek(type) {
      switch (type) {
        case "preWeek": {
          this.weekday = dayjs(this.weekday)
              .subtract(7, "day")
              .format("YYYY-M-D");
          this.getWeekDay();
          break;
        }
        case "nextWeek": {
          this.weekday = dayjs(this.weekday).add(7, "day").format("YYYY-M-D");
          this.getWeekDay();
          break;
        }
      }
    },
    handleCalendarShow() {
      this.fullCalendarShow = !this.fullCalendarShow;
    },
    getWeekDay() {
      this.dayList = [];
      let weekStart = dayjs(this.weekday).startOf("week").format("YYYY-M-D");

      for (let i = 0; i < 7; i++) {
        this.dayList.push({
          idx: dayjs(weekStart).add(i, "day").format("D"),
          day: dayjs(weekStart).add(i, "day").format("YYYY-M-D"),
        });
      }
    },
    handleDayClick(day) {
      this.day = day;
      //设置当前日期
      this.pageNo = 1
      this.chooseDay = dayjs(this.day).format("YYYY-MM-DD")
      this.collapseDay = this.day
      day.replace(/\//g, '-')
      this.flagList = []
      this.commonList = []
      this.finishList = []
      //查询数据
      this.getData()
      //调整calendar显示状态
      this.calendarShow = false
      //TODO 调用接口获取数据

    },
    ListhandleDayClick(day) {
      debugger
      this.day = day;
      //设置当前日期
      this.pageNo = 1
      this.chooseDay = dayjs(this.day).format('YYYY-MM-DD')
      this.collapseDay = this.day
      day.replace(/\//g, '-')
      this.flagList = []
      this.commonList = []
      this.finishList = []
      //查询数据
      this.getData()
      this.fullCalendarShow = false
    },
    getBuData() {
      scheduleDimensionTypeQuery().then(res => {
        if (res.successful) {
          let result = res.data
          //组装callType数据
          console.log(Object.keys(result))
          Object.keys(result).map((item, index) => {

            this.callTypeList.push({
              selected: false,
              descr: item
            })
            result[item].map(item => {
              this.callTypeSubList.push({
                id: item.id,
                selected: false,
                descr: item.callTypeName
              })
            })
          })


        } else {
          alert(res.message)
        }
      })
    },
    scheduleDimensionStatusQuery() {
      scheduleDimensionStatusQuery().then(res => {
        if (res.successful) {
          res.data.map(item => {
            this.statusList.push({selected: false, descr: item.paraValueCn})
          })
        } else {
          alert(res.message)
        }
      })
    },
    getPageData($state) {
      this.pageNo++
      //组装请求参数
      let param = {
        contact: this.searchText,
        startDate: this.chooseDay,
        endDate: this.chooseDay,
        pageNo: this.pageNo,
        limit: this.pageSize,
        online: this.callTypeList.filter(item => item.selected).map(item => item.descr),
        onlineSub: this.callTypeSubList.filter(item => item.selected).map(item => item.descr),
        status: this.statusList.filter(item => item.selected).map(item => item.descr),
      }
      let self = this
      //请求列表数据
      queryScheduleList(param).then((res) => {
            if (res.statusCode == 200) {
              if (res.data.length) {
                for (let i = 0; i < res.data.length; i++) {
                  let item = res.data[i]
                  if (item.finish == '已完成') {
                    this.finishList.push({
                      callMaterialName: item.callMaterialName,
                      callPlanId: item.callPlanId,
                      callReportDeadline: item.callReportDeadline,
                      callReportStatus: item.callReportStatus,
                      callReportTab: item.callReportTab,
                      callSubType: item.callSubType,
                      callSubTypeId: item.callSubTypeId,
                      callType: item.callType,
                      callTypeId: item.callTypeId,
                      category: item.category,
                      contact: item.contact,
                      contactId: item.contactId,
                      day: item.day,
                      empEmail: item.empEmail,
                      empId: item.empId,
                      finish: item.finish,
                      flag: item.flag,
                      hospital: item.hospital,
                      hospitalId: item.hospitalId,
                      status: item.status,
                      time: item.time,
                      timeDifference: item.timeDifference,
                      title: item.title,
                      userId: item.userId,
                      week: item.week,
                      isMore: item.sourceSys == 'se' ? true : false,
                      tableShow: true,
                      MoreList: [],
                    })
                    continue;
                  }
                  if (item.flag == 1) {
                    this.flagList.push({
                      callMaterialName: item.callMaterialName,
                      callPlanId: item.callPlanId,
                      callReportDeadline: item.callReportDeadline,
                      callReportStatus: item.callReportStatus,
                      callReportTab: item.callReportTab,
                      callSubType: item.callSubType,
                      callSubTypeId: item.callSubTypeId,
                      callType: item.callType,
                      callTypeId: item.callTypeId,
                      category: item.category,
                      contact: item.contact,
                      contactId: item.contactId,
                      day: item.day,
                      empEmail: item.empEmail,
                      empId: item.empId,
                      finish: item.finish,
                      flag: item.flag,
                      hospital: item.hospital,
                      hospitalId: item.hospitalId,
                      status: item.status,
                      time: item.time,
                      timeDifference: item.timeDifference,
                      title: item.title,
                      userId: item.userId,
                      week: item.week,
                      isMore: item.sourceSys == 'se' ? true : false,
                      tableShow: true,
                      MoreList: [],
                    })
                    continue
                  } else {
                    this.commonList.push({
                      callMaterialName: item.callMaterialName,
                      callPlanId: item.callPlanId,
                      callReportDeadline: item.callReportDeadline,
                      callReportStatus: item.callReportStatus,
                      callReportTab: item.callReportTab,
                      callSubType: item.callSubType,
                      callSubTypeId: item.callSubTypeId,
                      callType: item.callType,
                      callTypeId: item.callTypeId,
                      category: item.category,
                      contact: item.contact,
                      contactId: item.contactId,
                      day: item.day,
                      empEmail: item.empEmail,
                      empId: item.empId,
                      finish: item.finish,
                      flag: item.flag,
                      hospital: item.hospital,
                      hospitalId: item.hospitalId,
                      status: item.status,
                      time: item.time,
                      timeDifference: item.timeDifference,
                      title: item.title,
                      userId: item.userId,
                      week: item.week,
                      isMore: item.sourceSys == 'se' ? true : false,
                      tableShow: true,
                      MoreList: [],
                    })
                  }
                }
                $state.loaded()
              } else {
                $state.complete();
              }
            }

          }
      )
    },
    getData() {
      //组装请求参数
      let param = {
        contact: this.searchText,
        startDate: this.chooseDay,
        endDate: this.chooseDay,
        pageNo: this.pageNo,
        limit: this.pageSize,
        online: this.callTypeList.filter(item => item.selected).map(item => item.descr),
        onlineSub: this.callTypeSubList.filter(item => item.selected).map(item => item.descr),
        status: this.statusList.filter(item => item.selected).map(item => item.descr),
      }
      let self = this
      //请求列表数据
      queryScheduleList(param).then((res) => {
            if (res.statusCode == 200) {
              for (let i = 0; i < res.data.length; i++) {
                let item = res.data[i]
                //处理时间
                item.time = dayjs(item.time).format("HH:mm:ss");
                if (item.finish == '已完成') {
                  this.finishList.push({
                    callMaterialName: item.callMaterialName,
                    callPlanId: item.callPlanId,
                    callReportDeadline: item.callReportDeadline,
                    callReportStatus: item.callReportStatus,
                    callReportTab: item.callReportTab,
                    callSubType: item.callSubType,
                    callSubTypeId: item.callSubTypeId,
                    callType: item.callType,
                    callTypeId: item.callTypeId,
                    category: item.category,
                    contact: item.contact,
                    contactId: item.contactId,
                    day: item.day,
                    empEmail: item.empEmail,
                    empId: item.empId,
                    finish: item.finish,
                    flag: item.flag,
                    hospital: item.hospital,
                    hospitalId: item.hospitalId,
                    status: item.status,
                    time: item.time,
                    timeDifference: item.timeDifference,
                    title: item.title,
                    userId: item.userId,
                    week: item.week,
                    isMore: item.sourceSys == 'se' ? true : false,
                    tableShow: true,
                    MoreList: [],
                  })
                  continue;
                }
                if (item.flag == 1) {
                  this.flagList.push({
                    callMaterialName: item.callMaterialName,
                    callPlanId: item.callPlanId,
                    callReportDeadline: item.callReportDeadline,
                    callReportStatus: item.callReportStatus,
                    callReportTab: item.callReportTab,
                    callSubType: item.callSubType,
                    callSubTypeId: item.callSubTypeId,
                    callType: item.callType,
                    callTypeId: item.callTypeId,
                    category: item.category,
                    contact: item.contact,
                    contactId: item.contactId,
                    day: item.day,
                    empEmail: item.empEmail,
                    empId: item.empId,
                    finish: item.finish,
                    flag: item.flag,
                    hospital: item.hospital,
                    hospitalId: item.hospitalId,
                    status: item.status,
                    time: item.time,
                    timeDifference: item.timeDifference,
                    title: item.title,
                    userId: item.userId,
                    week: item.week,
                    isMore: item.sourceSys == 'se' ? true : false,
                    tableShow: true,
                    MoreList: [],
                  })
                  continue
                } else {
                  this.commonList.push({
                    callMaterialName: item.callMaterialName,
                    callPlanId: item.callPlanId,
                    callReportDeadline: item.callReportDeadline,
                    callReportStatus: item.callReportStatus,
                    callReportTab: item.callReportTab,
                    callSubType: item.callSubType,
                    callSubTypeId: item.callSubTypeId,
                    callType: item.callType,
                    callTypeId: item.callTypeId,
                    category: item.category,
                    contact: item.contact,
                    contactId: item.contactId,
                    day: item.day,
                    empEmail: item.empEmail,
                    empId: item.empId,
                    finish: item.finish,
                    flag: item.flag,
                    hospital: item.hospital,
                    hospitalId: item.hospitalId,
                    status: item.status,
                    time: item.time,
                    timeDifference: item.timeDifference,
                    title: item.title,
                    userId: item.userId,
                    week: item.week,
                    isMore: item.sourceSys == 'se' ? true : false,
                    tableShow: true,
                    MoreList: [],
                  })
                }
              }
            }

          }
      )
    },
    handleCallTypeSubSelected(index) {
      this.callTypeSubList[index].selected = !this.callTypeSubList[index].selected
    },
    handleCallTypeSelected(index) {
      this.callTypeList[index].selected = !this.callTypeList[index].selected
    },
    handleStatusSelected(index) {
      this.statusList[index].selected = !this.statusList[index].selected
    },
    //重置
    resetScreen() {
      //消除日程类型选中状态
      this.callTypeSubList.forEach(item => {
        item.selected = false
      })
      //消除线上/线下选中状态
      this.callTypeList.forEach(item => {
        item.selected = false
      })
      //消除状态选中状态
      this.statusList.forEach(item => {
        item.selected = false
      })
      this.flagList = []
      this.commonList = []
      this.finishList = []
      this.pageNo = 1
      this.getData()
      this.selectScreenNum = 0;
      this.showScreen = false
    },
    //查看
    screenResult() {
      this.selectScreenNum = 0;
      //线上线下
      for (let i = 0; i < this.callTypeList.length; i++) {
        if (this.callTypeList[i].selected === true) {
          this.selectScreenNum = this.selectScreenNum + 1;
        }
      }
      //日程
      for (let i = 0; i < this.callTypeSubList.length; i++) {
        if (this.callTypeSubList[i].selected === true) {
          this.selectScreenNum = this.selectScreenNum + 1;
        }
      }
      //状态
      for (let i = 0; i < this.statusList.length; i++) {
        if (this.statusList[i].selected === true) {
          this.selectScreenNum = this.selectScreenNum + 1;
        }
      }
      //查询数据
      this.flagList = []
      this.commonList = []
      this.finishList = []
      this.pageNo = 1
      this.getData()
      this.showScreen = false
    },
    //添加
    nav2add() {
      this.$router.push(`/schedule/add`)
    },
    //点击放大镜 根据筛选条件查询数据
    clickSearch() {
      this.flagList = []
      this.commonList = []
      this.finishList = []
      this.pageNo = 1
      this.getData();
    },
    // 输入搜索条件
    inputSearch(e) {
      this.searchText = e.currentTarget.value
    },
    // 点击筛选
    clickScreen() {
      scrollTo(0, 0)
      this.showScreen = !this.showScreen;
    },
    //进入详情页面
    nav2detail(id) {
      let param = {
        callPlanId: id,
        actionType: 'review'
      }
      schedulefeedback(param).then((res) => {
        if (res.statusCode == 200) {
          this.$router.push(`/schedule/detail/${id}`)
        }
      })
    },
  },

  mounted() {

    setTimeout(() => {
      this.loading = false;
      this.day = dayjs().format("YYYY-M-D");
      this.chooseDay = dayjs(this.day).format("YYYY-MM-DD");
      this.weekday = this.day;
      this.getWeekDay();
      this.getBuData()
      this.getData()
      this.scheduleDimensionStatusQuery()
    }, 1000);
  },
  watch: {
    day(newval, oldval) {
      this.fullCalendarShow = false;
      this.weekday = newval;
      this.getWeekDay();
      this.cal_label = dayjs(newval).format("YYYY/MM");
      this.chooseDay = dayjs(newval).format("YYYY-MM-DD");
    },
  },
};
</script>

<style scoped src="./indexList.css">

</style>